import React, { Component } from 'react'
import {WeaLocaleProvider} from "ecCom";
const getLabel = WeaLocaleProvider.getLabel;

class OperatorsInfoPanel extends Component {
    /**
        position:{
            left:num,
            top:num
        }
        noOperatedUsers:未操作
        viewedUsers 已查看
        operatedUsers 已操作
     */
    render() {
        const { position = {}, visible=false , nodeinfo={}} = this.props;
        const currentStyle = {
            display : visible?'block':'none',
            left : position.left + 'px',
            top : position.top + 'px'
        };

        let maxHeight = window.innerHeight - position.top - 40;
        return (
            <div style={currentStyle} className="wf-pop-operators-panel">
                <div className='header'>{getLabel(99,'操作者')}</div>
                <div className='content' style={{'maxHeight':maxHeight}}>
                    {this.renderOperateLine()}
                </div>
            </div>
        )
    }
    renderOperateLine = () => {
        const { position = {}, visible=false , nodeinfo={}, forecastNodeIds} = this.props;
        const { noOperatedUsers = [],operatedUsers = [],viewedUsers = [] , nodeEntity={}} = nodeinfo;
        const { operatorReplaceDatas = [],nodeStatus = '0'} = nodeEntity;
        const _tempObj = {},objArr = [];

        const isForecastNode = (nodeStatus == '0' || nodeStatus == '3') && (","+forecastNodeIds+",").indexOf(","+nodeEntity.id+",") > -1;

        if(noOperatedUsers.length > 0){
            _tempObj['noOperatedUsers'] = noOperatedUsers;
            objArr.push('noOperatedUsers');
        }
        if(viewedUsers.length > 0){
            _tempObj['viewedUsers'] = viewedUsers;
            objArr.push('viewedUsers');
        }
        if(operatedUsers.length > 0){
            _tempObj['operatedUsers'] = operatedUsers;
            objArr.push('operatedUsers');
        }
        if(objArr.length == 0 && operatorReplaceDatas.length > 0){
            objArr.push('noOperatedUsers');
            let users = [];
            operatorReplaceDatas.map(v=>{
                if(v.type === 'resource'){
                    users.push(v);
                }else{
                    v.users.map(c=>users.push(c));
                }
            });
            _tempObj['noOperatedUsers'] = users;
        }
        const operatorTitleStyle = {
            noOperatedUsers : '#6db341',
            viewedUsers : '#ff7906',
            operatedUsers : '#30b6ff'
        }
        let res = [];
        //未操作 - 已查看 - 已操作
        objArr.map(v=>{
            res.push(
                <div className='operator-type'>
                    { !isForecastNode &&
                        <p className='type-title' style={{color:operatorTitleStyle[v]}}>
                            {v=='noOperatedUsers'? getLabel(28500,'未操作'):v=='viewedUsers'? getLabel(18006,'已查看'): getLabel(28499,'已操作')}
                        </p>
                    }
                    <p className='type-list'>
                        {/* <span className='hrm-item' onClick={(e)=>{this.openHrmPanel(e)}}>111</span> */}
                        {
                            _tempObj[v].map((element,index,arr)=>{
                                const {userid,beAgentUserId,lastname,beAagentUserName,id,name} = element;

                                if(beAgentUserId > 0) {
                                    return (
                                        <spa>
                                            <span className='hrm-item' onClick={(e)=>{this.openHrmPanel(e,beAgentUserId)}}>{beAagentUserName}</span>
                                            {`->`}
                                            <span className='hrm-item' onClick={(e)=>{this.openHrmPanel(e,userid)}}>{lastname}</span>
                                        </spa>
                                    )
                                } else {
                                    return <span className='hrm-item' onClick={(e)=>{this.openHrmPanel(e,userid || id)}}>{lastname || name}</span>
                                }
                            })
                        }
                    </p>
                </div>
            )
        })
        if(res.length == 0){
            res.push(<p>{getLabel(390474,'暂无数据！')}</p>)
        }
        return res;
    }
    openHrmPanel = (event,id=21) => {
        let isTouch = 'ontouchstart' in document.documentElement;
        if(isTouch) {
            window.parent.formOpenHrmCard(id, true);
        } else {
            window.openhrm(id);
            window.pointerXY(event);
        }
    }

    //打开人力资源卡片
    // formOpenHrmCard = (id, isWindowOpen) => {
    //     let url = `/spa/hrm/static4mobile/index.html#/resourceInfo/${id}`;
    //     window.open(url);
    // }
}

export default OperatorsInfoPanel;
